import React, { useState } from'react';
import {Image, View} from '@tarojs/components';
import BottomNavigation from '../../components/BottomNavigation/BottomNavigation';
import './index.scss';
import { navigateTo } from '@/utils/navigation'
import PageWrapper from '@/components/PageWrapper'
const Index: React.FC = () => {
  const [selectedIndex, setSelectedIndex] = useState(0);

  return (
    <PageWrapper title="消息" showBack={false} backgroundColor='#F0F0F0'>
      <View className="message-page">
        <View className="content">
          <View className="msg-box">
            <View className="msg-item" onClick={() => navigateTo('/pages/message/index')}>
              <Image className="title-img" src={require(`../../assets/message/set-msg.png`)}></Image>
              <View className="box">
                <View className="title">国鉴消息</View>
                <View className="dsc">关于1.0版本的使用声明通知......</View>
              </View>
            </View>
            <View className="msg-item" onClick={() => navigateTo('/pages/interactive-message/index')}>
              <Image className="title-img" src={require(`../../assets/message/set-msg.png`)}></Image>
              <View className="box">
                <View className="title">互动消息</View>
                <View className="dsc">谁谁谁点蟹了你的图文内容......</View>
              </View>
            </View>
            <View className="msg-item" onClick={() => navigateTo('/pages/wallet-message/index')}>
              <Image className="title-img" src={require(`../../assets/message/set-msg.png`)}></Image>
              <View className="box">
                <View className="title">钱包通知</View>
                <View className="dsc">领取10元3张优惠券成功......</View>
              </View>
            </View>
          </View>
        </View>
        <BottomNavigation selectedIndex={selectedIndex} onTabChange={setSelectedIndex} />
      </View>
    </PageWrapper>
  );
};

export default Index;
